<template>
  <MkQueryContainer>
    <template #header>
      <MkForm ref='queryForm' :model='searchParam' :inline='true'>
        <MkInput label='关键字' @keyup.enter.native='search' v-model='searchParam.keyword' clearable />
        <el-form-item>
          <MkButtonQuery @click='search'> </MkButtonQuery>
          <MkButtonAdd @click='add'> </MkButtonAdd>
        </el-form-item>
      </MkForm>
    </template>
    <MkTable :data='tableData' v-loading='loading' @row-dblclick="edit">
      <MkColumnIndex />
      <MkColumn prop='id' label='产品代码' />
      <MkColumn prop='mingCheng' label='产品名称' />
      <MkColumn prop='daLei' label='血液大类' />
      <MkColumnBasEntity prop='pinZhongId' label='血液品种' entity="BasXueYePinZhong" />
      <MkColumn prop='bieMing' label='产品别名，汇总用' />
      <MkColumn prop='remark' label='备注' />
      <MkColumnIsEnabled />
      <MkColumnOption @show='edit' :isMore='false' />
    </MkTable>
    <MkPagination v-model:page='searchParam.page' v-model:pageSize='searchParam.pageSize' :total='total'
      @query='search' />
    <EditPage ref='editPageRef' @query='search' />
  </MkQueryContainer>
</template>

<script lang='ts' setup name="basXueYeChanPin">
// 血液产品资料
import { BasXueYeChanPinApi, BasXueYeChanPinOutput } from '/@/api/bas/BasXueYeChanPin';
import { usePageQuery } from '/@/hooks/usePageQuery'
import { clog, showSuccess } from '/@/utils'

import EditPage from './edit.vue'

const { searchParam, total, tableData, loading, search } = usePageQuery<BasXueYeChanPinOutput>(BasXueYeChanPinApi.page)

const editPageRef = ref();

onMounted(() => {
  search();
})

const add = () => {
  editPageRef.value.open();
}

const edit = (row: any) => {
  editPageRef.value.open(row);
}

</script>

<style lang='scss' scoped></style>